import config from '@/config/defaultSettings'
import { ConfigProvider } from 'ant-design-vue'
const colorList = [
  {
    key: '拂晓蓝（默认）',
    color: config.primaryColor
  },
  {
    key: '薄暮',
    color: '#F5222D'
  },
  {
    key: '火山',
    color: '#FA541C'
  },
  {
    key: '日暮',
    color: '#FAAD14'
  },
  {
    key: '明青',
    color: '#13C2C2'
  },
  {
    key: '极光绿',
    color: '#52C41A'
  },
  {
    key: '极客蓝',
    color: '#2F54EB'
  },
  {
    key: '酱紫',
    color: '#722ED1'
  }
]

const updateDarkMode = (isDark) => {
  let styleTag = document.getElementById('themeCss')
  const appTag = document.getElementById('html')
  if (!styleTag) {
    styleTag = document.createElement('link')
    styleTag.setAttribute('id', 'themeCss')
    document.head.appendChild(styleTag)
  }
  if (isDark) {
    styleTag.setAttribute('href', '/themes/dark.css')
    appTag!.className = 'darkMode'
  } else {
    styleTag.setAttribute('href', '')
    appTag!.className = ''
  }
}

const updateColorWeak = (isColorWeak) => {
  const app = document.getElementById('html')
  isColorWeak ? app!.classList.add('colorWeak') : app!.classList.remove('colorWeak')
}

const updateGrayMode = (isGrayMode) => {
  const app = document.getElementById('html')
  isGrayMode ? app!.classList.add('grayMode') : app!.classList.remove('grayMode')
}
function changeVarColor(key, value) {
  const r = document.querySelector(':root')
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore
  r.style.setProperty(key, value)
}
function hexToRgba(hex, opacity) {
  return hex && hex.replace(/\s+/g, '').length === 7
    ? 'rgba(' +
        parseInt('0x' + hex.slice(1, 3)) +
        ',' +
        parseInt('0x' + hex.slice(3, 5)) +
        ',' +
        parseInt('0x' + hex.slice(5, 7)) +
        ',' +
        opacity +
        ')'
    : ''
}
function updateTheme(color: string): void {
  ConfigProvider.config({
    theme: { primaryColor: color }
  })
  changeVarColor('--scrollbar-thumb-color', hexToRgba(color, 0.8))
  changeVarColor('--scrollbar-track-color', hexToRgba(color, 0.2))
}
export { colorList, updateColorWeak, updateGrayMode, updateDarkMode, updateTheme }
